@charset "utf-8";
@import 'reset';
$fontSize:40;
@function r($p) {
    @return $p/$fontSize*1rem;
}
.web{
    width: r(640);
    height: r(800);
}
        header {
            .top {
                ul {
                    width: r(640);
                    height: r(75);
                    border-bottom: 1px solid #A7A7A7;
                    display: flex;
                    justify-content: space-between;
                    align-items: center;
                    li {
                        display: flex;
                        align-items: center;
                        font-size: r(30);
                        color: #343434;
                        a {
                            display: flex;
                            align-items: center;
                            margin: 0 r(29);
                            font-size: r(24);
                            color: #585858;
                            img {
                                height: r(38);
                            }
                        }
                    }
                    .con{
                        margin: 0 auto;
                        transform: translate(-35%);
                    }
                }
            }
            
        }
.conter{
    width:r(640);
    .drop_down{
        width: r(640);
        height: r(60);
        ul{
            width: r(640);
            height: r(60);
            display: flex;
            justify-content: space-around;
            align-items: center;
            background: #F2F2F2;
            li{
                display: flex;
                align-items: center;
                span{
                    font-size: r(20);
                }
                img{
                    width: r(16);
                    margin-left: r(9);
                    cursor: pointer;
                }
            }
        }
    }
    .images{
        width: r(640);
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        align-items: center;
        
        .img{
            width: r(212);
            height: r(212);
            overflow: hidden;
            position: relative;
            margin-bottom:r(3);
            img{
                width:r(212);
            }
            .text{
                position: absolute;
                width: 100%;
                bottom: 0;
                left: 0;
                background:rgba(255,255,255,.5);
                p{
                    text-align: center;
                    font-size: r(20);
                    color: #757376;
                    vertical-align: middle;
                    span{
                        border-right:1px solid #757376;
                        display: inline-block;
                        height: r(15);
                        line-height: r(12);
                        vertical-align: middle;
                        margin: 0 r(5);
                    }
                }
            }
        }
    }
        
}

